<template>
  <div style="text-align: left">
    <Row align="center" justify="end">

      <Button style="margin-right: 0.5rem;" size="small" type="info" ghost icon="ios-download-outline" @click="pendingOffline()"
              v-if="orderDetail.orderState.state == 100 || orderDetail.orderState.state == 101 || orderDetail.orderState.state == 104" v-has="tRole.ORDER_1_230">线下收款挂起</Button>
      <Button style="margin-right: 0.5rem;" size="small" type="info" ghost icon="ios-download-outline" @click="showOfflineConfirmModal()"
              v-if="orderDetail.orderState.state == 116 && orderDetail.payWay == 0" v-has="tRole.ORDER_1_230">确认线下收款</Button>
      <Button size="small" @click="back" type="info" ghost >返回</Button>
      <router-link v-if="orderDetail.orderState.state==115 " :to="{name:'purchase',params:{id:orderDetail.id,serialNumber:orderDetail.serialNumber,checkoutTime:orderDetail.checkoutTime,countryName:orderDetail.countryName,actualPayment:orderDetail.actualPayment,orderState:orderDetail.orderState}}">
        <Button size="small" type="primary" ghost style="margin-left: 0.5rem">去采购</Button>
      </router-link>
      <router-link v-has=tRole.ORDER_1_212 v-if="!orderDetail.isHistoryOrder&&(orderDetail.orderState.shipState==111 || orderDetail.orderState.shipState==112|| orderDetail.orderState.shipState==114)" :to="{name:'newOrderShip',params:{shortOrderInfo:tData.shortOrderInfo}}">
        <Button size="small" type="primary" ghost style="margin-left: 0.5rem">拆单发货</Button>
      </router-link>

    </Row>

    <Tabs value="name1">
      <TabPane label="基本信息" name="name1">

        <div>

          <Steps :current="getStep(orderDetail.orderState)" style="padding: 1rem;border: solid 1px #f3f3f3;margin-bottom: 1rem" >
            <Step title="下单" :content="getFormatedDateTime(orderDetail.createtime)"></Step>
            <Step v-if="orderDetail.orderState.state==102" title="取消未支付订单" ></Step>
            <Step v-else title="已付款" :content="getFormatedDateTime(orderDetail.checkoutTime)"></Step>
            <Step v-if="orderDetail.orderState.state==116" title="款项和风险确认-拦截" ></Step>
            <Step v-else title="款项和风险确认" ></Step>
            <Step title="备货中" ></Step>
            <Step title="已出库" ></Step>
            <Step v-if="orderDetail.orderState.shipState==111" title="部分已发货" content=""></Step>
            <Step v-else title="全部已发货" content=""></Step>
            <Step v-if="orderDetail.orderState.state==121" title="后台退款" ></Step>
            <Step v-if="orderDetail.orderState.state==122" title="部分退款" ></Step>
            <Step v-if="orderDetail.orderState.state==120" title="全部退款" content="(用户取消)"></Step>
            <Step v-else-if="orderDetail.orderState.state==150" title="用户拒付" ></Step>
            <Step v-else-if="orderDetail.orderState.state==200" title="用户删除" ></Step>
            <Step v-else title="交易结束" ></Step>

          </Steps>


          <h3>基本信息</h3>
          <div style="padding: 0.3rem 0 0.8rem 0">
            <Tag v-if="orderDetail.firstOrder===1 || orderDetail.firstOrder===2" color="magenta">{{orderDetail.firstOrder===1?'首单':'复购'}}</Tag>
            <KeyValueView title="订单编号">{{orderDetail.serialNumber}}</KeyValueView>
            <KeyValueView title="订单状态">{{getOrderCnName(orderDetail.orderState)}}</KeyValueView>
            <KeyValueView v-if="orderDetail.checkoutTime" title="付款时间">{{getFormatedDateTime(orderDetail.checkoutTime)}}</KeyValueView>
            <KeyValueView v-else title="下单时间">{{getFormatedDateTime(orderDetail.createtime)}}</KeyValueView>
            <br>
            <KeyValueView title="购买者">{{orderDetail.encodeName}}</KeyValueView>
            <KeyValueView  title="用户标签">
              {{isNotEmpty(userTag)?userTag:'无'}}
            </KeyValueView>
            <KeyValueView oneline title="用户备注"> {{isNotEmpty(orderDetail.note)?orderDetail.note:'无'}} </KeyValueView>
            <KeyValueView  title="重要说明"> {{isNotEmpty(orderDetail.importantNote)?orderDetail.importantNote:'无'}} </KeyValueView>
            <Button size="small" type="text"  style="color: #2db7f5" @click="showEditImportantNote(orderDetail)"
                    v-has=tRole.ORDER_1_110 v-if="orderDetail.orderState.state >= 110 && orderDetail.orderState.state <= 140">修改重要说明</Button>
          </div>
          <divider/>

          <h3>产品和支付</h3>
          <div style="padding: 0.3rem 0 0.8rem 0">
            <KeyValueView title="款式数量">{{orderDetail.skuCount}}款</KeyValueView>
            <KeyValueView title="产品总量">{{orderDetail.productCount}}个</KeyValueView>
            <KeyValueView title="产品总重">{{orderDetail.weight/1000}}kg</KeyValueView>
            <br>
            <KeyValueView title="支付方式">{{getDictName('payTypeDict',orderDetail.payWay)}}</KeyValueView>
            <Button type="info" size="small" icon="ios-document-outline" @click="showCreditCard()"
                    ghost v-if="orderDetail.payWay == 112" v-has=tRole.ORDER_1_228>卡号</Button>
            <KeyValueView title="产品总价">${{this._.round(orderDetail.actualPayment - orderDetail.postage,2)}}</KeyValueView>
            <KeyValueView v-if="orderDetail.creditCard" title="支付卡号 ">{{orderDetail.creditCard.cardNumber}}</KeyValueView>
            <KeyValueView title="物流配送费 ">${{orderDetail.postage}}</KeyValueView>
            <KeyValueView title="订单原价">${{orderDetail.originalPrice}}</KeyValueView>
            <KeyValueView title="实际付款"> ${{orderDetail.actualPayment}}</KeyValueView>
            <KeyValueView title="款项记录">
              <Button @click="showPaymentRecord(orderDetail)" size="small" type="text"  style="color: #2db7f5" v-if="orderDetail.orderState.state >= 110" v-has=tRole.ORDER_1_220>查看记录</Button>
              <Button   size="small" style="font-size: 12px" icon="ios-document-outline" @click="showOrderDiscounts(orderDetail.id)"
                      v-if="orderDetail.originalPrice > orderDetail.actualPayment" >查看优惠项</Button>
            </KeyValueView>
          </div>

          <divider/>

          <h3>运营备注
            <Button size="small" type="text" v-has=tRole.ORDER_1_219 @click="showEditNote(orderDetail)" style="color: #2db7f5">追加+</Button>
          </h3>
          <div v-for="(item,index) in orderDetail.innerNoteList" style="padding: 0.3rem 0 0.8rem 0">
            <p>{{index+1}}. {{item.content}} <span class="base_key" style="margin-left: 1rem"> {{item.employeeName}} {{getFormatedDateTime(item.createtime)}}</span></p>
          </div>
          <divider/>

          <h3>物流和报税</h3>
          <div style="padding: 0.3rem 0 0.8rem 0">
            <span v-has=tRole.ORDER_1_223>
              <KeyValueView title="收件人">{{$tiyHideUsername(orderDetail.receiverInfo.userFullName)}}</KeyValueView>
              <Button type="default"  size="small" style="font-size: 12px"  @click="copy(orderDetail.receiverInfo.userFullName)"> 复制收件人  </Button>
            </span>
            <span v-has=tRole.ORDER_1_206 style="margin-left: 1rem">
              <KeyValueView title="联系电话">{{$tiyHidePhone(getReceiverPhone(orderDetail.receiverInfo))}}</KeyValueView>
               <Button type="default" size="small" style="font-size: 12px"    @click="copy(getReceiverPhone(orderDetail.receiverInfo))"> 复制电话  </Button>
            </span>
            <br/>
            <KeyValueView title="配送方式">
              <span v-if="isNotEmpty(orderDetail.receiverInfo.shippingInfosV38) && isNotEmpty(orderDetail.receiverInfo.shippingInfosV38[0]) && isNotEmpty(orderDetail.receiverInfo.shippingInfosV38[0].name)">
                  {{orderDetail.receiverInfo.shippingInfosV38[0].name}}</span>
              <span v-else>{{getDictName('postageMethodDict',orderDetail.deliveryMethod)}}</span>
            </KeyValueView>
            <KeyValueView v-if="isNotEmpty(orderDetail.receiverInfo.shippingInfosV38) && isNotEmpty(orderDetail.receiverInfo.shippingInfosV38[0]) && isNotEmpty(orderDetail.receiverInfo.shippingInfosV38[0].innerNote)" title="运输方式备注(内)">{{orderDetail.receiverInfo.shippingInfosV38[0].innerNote}}</KeyValueView>
            <br>
            <KeyValueView v-if="orderDetail.logisticsInvoiceType" title="报税方式">{{getLogisticsInvoiceType(orderDetail.logisticsInvoiceType)}}</KeyValueView>
            <KeyValueView v-if="isNotEmpty(orderDetail.businessName)" title="报税企业名">{{yNoneText(orderDetail.businessName)}}</KeyValueView>
            <KeyValueView v-if="orderDetail.shortageOption" oneline title="缺货处理方式">
              <span v-if="orderDetail.shortageOption == 100">正常发货，缺货产品退款。（Send in stock products directly and add credit to your account for out of stock items.）</span>
              <span v-if="orderDetail.shortageOption == 200">联系客户。（Inform you the shortage detail, wait for your decision (This option may cause 2 days delay in delivery).）</span>
            </KeyValueView>
          </div>
          <divider/>

          <h3 v-has=tRole.ORDER_1_224>收货地址</h3>
          <div v-has=tRole.ORDER_1_224 style="padding: 0.3rem 0 0.8rem 0">
            <KeyValueView title="Country">{{yNoneText(orderDetail.receiverInfo.countryName)}}</KeyValueView>
            <KeyValueView title="Country Code">{{yNoneText(orderDetail.receiverInfo.countryCode)}}</KeyValueView>
            <KeyValueView title="State">{{yNoneText(orderDetail.receiverInfo.state)}}</KeyValueView>
            <KeyValueView title="City">{{yNoneText(orderDetail.receiverInfo.cityName)}}</KeyValueView>
            <KeyValueView title="Zip Code">{{yNoneText(orderDetail.receiverInfo.postalCode)}}</KeyValueView>
            <br>
            <KeyValueView title="Street Address"> {{yNoneText(orderDetail.receiverInfo.streetAddress)}}</KeyValueView>
            <KeyValueView title="Apt/Suite/Unit">{{yNoneText(orderDetail.receiverInfo.unit)}}</KeyValueView>
          </div>

        </div>

      </TabPane>



      <TabPane label="用户产品列表" name="name2">

        <Row style="padding: 1rem 0">
          <i-col flex="1">
            <RadioGroup v-model="packageRadio" >
              <Radio label="全部显示">全部显示</Radio>
              <span v-for="(pck,pIndex) in orderDetail.packages">
                <Radio :label="pIndex" >
                  {{pckName(pck.state,pIndex)}}
                </Radio>
              </span>
            </RadioGroup>
          </i-col>
          <i-col>
            <Checkbox v-model="isHideColorItem" >不显示色卡</Checkbox>
          </i-col>
        </Row>

        <div>
          <div v-for="(pck,pIndex) in orderDetail.packages">
            <Row  v-for="(product,index) in pck.products">
                <Row v-if="packageRadio==pIndex||packageRadio=='全部显示'" class="order_product_row" style="width: 100%">
                  <i-col  :xs="24" :sm="3">
                    <img :src="yunPath + (product.zipImagesColor != null ?product.zipImagesColor[0].imagePath : product.originalImagePath)"
                         style="width:99%;max-width:100px;max-height:100px;"
                         @click="status.modalImage.url=yunPath + product.originalImagePath;status.modalImage.isShow = true;"/>
                  </i-col>
                  <i-col :xs="24" :sm="21">
                    <div>
                      <Tag color="magenta"> {{pckName(pck.state,pIndex)}}</Tag>
                      <KeyValueView title="序号" >
                        {{index+1}}
                      </KeyValueView>
                      <KeyValueView title="产品编码" >
                        <a target="_blank" :href="$tiyProductUrl(product.productCode)">{{product.productCode}}</a>
                      </KeyValueView>
                      <KeyValueView title="货源" v-has=tRole.ORDER_1_225>
                        <span  @click="showProductSupply(product.id)" style="color: #1e93ff;cursor: pointer"  >查看货源</span>
                      </KeyValueView>

                      <br>
                      <KeyValueView title="一档售价" >${{product.items[0].originalPrice}}</KeyValueView>
                      <KeyValueView title="实际支付" >${{product.actualPrice}}</KeyValueView>
                      <KeyValueView title="件数" >{{product.amount}}</KeyValueView>
                      <KeyValueView title="单件毛重" >{{product.items[0].weight}}g</KeyValueView>
                      <KeyValueView title="累计毛重" >{{product.weight}}g</KeyValueView>

                    </div>
                    <KeyValueView title="产品名称" oneline v-mobile="false">{{product.productName}}</KeyValueView>
                    <divider dashed v-show="!isHideColorItem" style="margin: 12px 0"></divider>
                    <div v-for="(colorItem, colorIndex) in product.items" style="padding: 0.3rem 0" v-show="!isHideColorItem">
                      <KeyValueView title="色卡图">
                        <span style="cursor: pointer;"
                              @click="status.modalImage.url=yunPath + colorItem.zipImagesColor[0].imagePath;status.modalImage.isShow = true;">点我查看</span>
                      </KeyValueView>
                      <KeyValueView title="色卡">
                        {{colorItem.color}}
                      </KeyValueView>
                      <KeyValueView title="尺码">{{colorItem.sizeName}}</KeyValueView>
                      <KeyValueView title="数量">{{colorItem.amount}}</KeyValueView>
                      <KeyValueView title="状态">{{orderItemStateDict.filter(item => item.value == colorItem.state)[0].name}}</KeyValueView>
                      <divider type="vertical"></divider>
                      <span @click="showItemRecord(colorItem)"  ghost style="color: #757575;font-size: 12px;cursor: pointer">操作记录</span>
                    </div>

                  </i-col>
                </Row>
            </Row>
          </div>
          <Row class="order_product_row_top"></Row>
        </div>


      </TabPane>




      <TabPane label="用户订单状态" name="name3">
        <Alert type="warning">
          此处的订单状态仅用户可见, 与我们实际的订单处理互不影响. 在这里我们可以人为的添加一些虚拟的状态记录, 完全自定义想展示给用户看的内容.
        </Alert>
        <Steps v-if="isNotEmpty(orderDetail.orderState)&&isNotEmpty(orderDetail.orderShowRecord)" :current="currentStep" direction="vertical" >
          <Step v-if="state.code<=50||orderDetail.orderState.showState==100||orderDetail.orderState.showState==200||orderDetail.orderState.showState==300" class="step_content" v-for="state in userStateEnum">

            <div slot="title" >
              <span>{{state.cnName}}</span>
              <Button @click="showOrderShowRecord('',state.code,new Date())" style="margin-left: 1rem;font-size: 12px" size="small" >+新增子记录</Button>
            </div>
            <ol slot="content" v-for="item in orderDetail.orderShowRecord.recordList">
              <li v-if="item.showState==state.code" style="padding: 0.25rem 0rem; font-size: 13px" >
                <span style="padding: 0.25rem">{{item.content}}</span>
                <KeyValueView v-if="isNotEmpty(item.showTime)"  style="margin-left:0.5rem;" title="时间">{{getSDFDateTime(item.showTime.time*1000)}}</KeyValueView>
                <KeyValueView  style="margin-left:0.5rem;" title="操作人">{{item.type==1?'系统':item.creator}}</KeyValueView>
                <div  v-if="item.type===2"  style="display: inline-block" >
                  <Button  @click="showOrderShowRecord(item.recordId,state.code,new Date(item.showTime.time*1000))" style="margin: 0 0.25rem;font-size: 12px"  size="small" >修改</Button>
                  <Button  @click="deleteOrderShowRecord(item.recordId)" size="small"  style="margin: 0 0.25rem;font-size: 12px"  type="error" ghost>删除</Button>
                </div>

              </li>
            </ol>

          </Step>

        </Steps>
      </TabPane>
    </Tabs>

    <!--订单款项记录-->
    <Modal v-model="status.modalPaymentRecordShow" title="订单款项明细"
           :closable=true :styles="{align:'center',width:'70%',}" :scrollable=true>
      <!--表格和分页-->
      <Table stripe border :context="this" :columns="paymentRecordTable" :data="orderPaymentRecordsList"
             class="table_css" no-data-text="暂无数据"></Table>
      <div slot="footer">
        <Button type="primary" @click="status.modalPaymentRecordShow = false;">确定</Button>
      </div>
    </Modal>

    <!--添加运营备注-->
    <Modal v-model="status.modalInnerNote.isShow" title="添加运营备注"
           :closable="false" :mask-closable="false" @on-ok="modifyInnerNote()">
      <Form ref="params.modifyInnerNote" :model="params.modifyInnerNote" label-colon :label-width="80"
            class="y_condition">
        <FormItem label="运营备注" prop="innerNote">
          <Input type="textarea" v-model.trim="params.modifyInnerNote.innerNote" style="width: 360px;margin-right: 10px;" :rows="5"/>
        </FormItem>
      </Form>
    </Modal>

    <!--修改重要说明-->
    <Modal v-model="status.modalImportantNote.isShow" title="修改重要说明"
           :closable="false" :mask-closable="false" @on-ok="modifyImportantNote()">
      <Form ref="params.modifyImportantNote" :model="params.modifyImportantNote" label-colon :label-width="80">
        <FormItem label="重要说明" prop="importantNote">
          <Input type="textarea" v-model.trim="params.modifyImportantNote.importantNote" :rows="5" style="width: 90%;"/>
          <Icon type="ios-close-circle" @click="clearImportantNote()" style="position: absolute; margin-left: -18px; margin-top: 5px;"/>
        </FormItem>
      </Form>
    </Modal>

    <!--订单日志-->
    <Modal v-model="status.modalOrderShowRecord.isShow" title="用户订单状态记录"
           :closable="false" :mask-closable="false" @on-ok="modifyOrderShowRecord()">
      <Form ref="params.orderShowRecord" :model="params.orderShowRecord" label-colon :label-width="80">
        <FormItem label="时间" prop="importantNote">
          <DatePicker v-model.trim="params.orderShowRecord.showTime" format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="Select date and time" style="width: 200px"></DatePicker>
        </FormItem>
        <FormItem label="内容" prop="importantNote">
          <Input type="textarea" v-model.trim="params.orderShowRecord.content" :rows="5" style="width: 90%;"/>

        </FormItem>
      </Form>
    </Modal>

    <!--查看订单项记录弹出框-->
    <Modal v-model="status.modalRecord.isShow" :title="status.modalRecord.title"
           :styles="{align:'center',width:'60%',padding:'2rem'}" :scrollable=true>
      <Row v-if="status.modalRecord.recordType == 3">
        <i-col span="8">
          <div><span class="key">产品编号 :</span> {{status.modalRecord.info.productCode}}</div>
        </i-col>
        <i-col span="8">
          <div><span class="key">产品色卡 :</span> {{status.modalRecord.info.productColor}}</div>
        </i-col>
        <i-col span="8">
          <div><span class="key">尺码 :</span> {{status.modalRecord.info.productSize}}</div>
        </i-col>
      </Row>
      <!--表格和分页-->
      <Table stripe border :context="this" :columns="recordDetailTitles" :data="selectRecordList"
             class="table_css"
             no-data-text="暂无数据"></Table>
    </Modal>
    <!--查看图片弹出框-->
    <Modal v-model="status.modalImage.isShow" title="" :styles="{align:'center'}" :scrollable=true>
      <div slot="footer"></div>
      <div align="center"><Img :src="status.modalImage.url" style="max-width: 300px"/></div>
    </Modal>

    <!--折扣-->
    <Modal v-model="status.modalDiscount.isShow" :title="status.modalDiscount.title"
           :closable=true :styles="{align:'center',width:'50%',}" :scrollable=true>
      <!--表格和分页-->
      <Table stripe border :context="this" :columns="discountTitles" :data="discountList"
             class="table_css" no-data-text="暂无数据"></Table>
    </Modal>

    <!--查看产品货源弹出框-->
    <Modal v-model="status.modalSupply.isShow" title="产品货源"
           :styles="{align:'center',width:'70%',padding:'2rem'}" :scrollable=true>
      <!--表格和分页-->
      <Table stripe border :columns="productSupplyTable" :data="tData.productSupplyList"
             class="table_css" no-data-text="暂无数据"></Table>
    </Modal>

    <!-- 线下收款确认 -->
    <Modal v-model="status.modalConfirmOffline.isShow" title="线下收款确认" :mask-closable="false" @on-ok="confirmOffline()">
      <Form ref="confirmOffline" label-colon :model="paramConfirmOffline" label-position="right" :label-width="120" :rules="status.confirmOfflineRules">
        <FormItem label="收款方式" prop="payway">
          <Select v-model="paramConfirmOffline.payway" placeholder="请选择" class="modal_form_input" >
            <Option value=410 >电子转账</Option>
          </Select>
        </FormItem>
        <FormItem label="固定手续费" prop="fixedPoundage">
          <InputNumber type="number" v-model.trim="paramConfirmOffline.fixedPoundage" placeholder="请输入" class="modal_form_input" :precision=2 :min=0></InputNumber>
        </FormItem>
        <Alert type="warning">浮动手续费和浮动手续费比例根据收款情况填写。</Alert>
        <FormItem label="浮动手续费" prop="ratePoundage">
          <InputNumber type="number" v-model.trim="paramConfirmOffline.ratePoundage"class="modal_form_input" :precision=2 :min=0>></InputNumber>
        </FormItem>
        <FormItem label="浮动手续费比例" prop="rate">
          <InputNumber type="number" v-model.trim="paramConfirmOffline.rate" class="modal_form_input"
                       :formatter="value => `${value}%`" :parser="value => value.replace('%', '')" :max="100" :precision=1 :min=0>></InputNumber>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button @click="status.modalConfirmOffline.isShow = false;">取消</Button>
        <Button type="primary" @click="confirmOffline()">确认</Button>
      </div>
    </Modal>

  </div>
</template>

<script>
import KeyValueView from "../widgets/KeyValueView";
import tiyData from "./js/orderDetails/order_detail_data.js";
import {isNotEmpty} from "../js/commonUtils";
import {
  webOrderDetail,
  deliver,
  webDeliver,
  webExportOrderBlank,
  webExportInvoice,
  exportStandardInvoice,
  webItemRecord,
  trackPackage,
  showItemDiscounts,
  clearSelectedOrderItem,
  refundItems,
  splitItem,
  cancelUnconfirmedOrder,
  modifyInnerNote,
  modifyImportantNote,
  getPaymentRecords,
  showOrderDiscounts,
  showProductSupply,
  webOrderRecord,
  webPackageRecord,
  refusePayment,
  getCreditCard,
  modifyOrderShowRecord,
  deleteOrderShowRecord,
  pendingOffline,
  confirmOffline,
} from "./js/orderDetails/order_detail_fun.js";



export default {
  components: {KeyValueView},
  data() {
    return {
      status: tiyData.tStatus,
      params: tiyData.tParams,
      tData: tiyData.tData,
      packageRadio:'全部显示',
      orderDetail: tiyData.tData.orderDetail,
      orderStateDict: this.$store.getters.dictionaries.orderStateDict,
      //字典 包裹状态
      packageStateDict: this.$store.getters.dictionaries.packageStateDict,
      //字典 订单子项状态
      orderItemStateDict: this.$store.getters.dictionaries.orderItemStateDict,
      //字典 支付方式
      payTypeDict: this.$store.getters.dictionaries.payTypeDict,
      //字典 配送方式
      postageMethodDict: this.$store.getters.dictionaries.postageMethodDict,
      //字典 配送方式
      refundReasonDict: this.$store.getters.dictionaries.refundReasonDict,
      yunPath: this.$store.getters.imgPrefix,
      orderPaymentRecordsList : tiyData.tData.orderPaymentRecords,
      paymentRecordTable : tiyData.tableTitles.tablePaymentRecord(this),
      discountTitles: tiyData.tableTitles.tableDiscount,
      discountList: tiyData.tData.discounts,
      orderStateEnum: this.$store.getters.order.orderStateEnum,//枚举 订单状态
      userStateEnum: this.$store.getters.order.userStateEnum,//枚举 用户订单状态
      tRole: {//权限
        ORDER_1_206: "ORDER-1-206",//联系电话
        ORDER_1_207: "ORDER-1-207",//导出配货单---
        ORDER_1_208: "ORDER-1-208",//导出发货单---
        ORDER_1_209: "ORDER-1-209",//取消订单（款项未到账）---
        ORDER_1_210: "ORDER-1-210",//整单退款---
        ORDER_1_211: "ORDER-1-211",//整单发货---
        ORDER_1_212: "ORDER-1-212",//拆单发货---
        ORDER_1_213: "ORDER-1-213",//提交缺货退款---
        ORDER_1_215: "ORDER-1-215",//跟踪包裹----
        ORDER_1_216: "ORDER-1-216",//修改运单号----
        ORDER_1_217: "ORDER-1-217",//未使用
        ORDER_1_219: "ORDER-1-219",//运营备注
        ORDER_1_220: "ORDER-1-220",//查看款项记录
        ORDER_1_223: "ORDER-1-223",//收件人
        ORDER_1_224: "ORDER-1-224",//收货地址
        ORDER_1_225: "ORDER-1-225",//查看货源
        ORDER_1_226: "ORDER-1-226",//用户拒付---
        ORDER_1_110: "ORDER-1-110",//修改重要说明
        ORDER_1_227: "ORDER-1-227",//导出发票---
        ORDER_1_228: "ORDER-1-228",//卡号
        ORDER_1_230: "ORDER-1-230",
      },
      selectRecordList: tiyData.tData.selectRecord,
      recordDetailTitles: tiyData.tableTitles.tableRecordDetail,
      productSupplyTable: tiyData.productSupplyTable(this),
      isHideColorItem:false,
      paramConfirmOffline: tiyData.tParams.confirmOffline,
    }
  },
  methods:{
    pendingOffline(){
      this.$Modal.confirm({
        title: '线下收款订单挂起',
        content: '<p>确认此订单为线下收款，并将状态改为"待确认收款"？</p>',
        onOk: () => {
          pendingOffline(this, tiyData);s
        }
      });
    },
    showOfflineConfirmModal(){
      let confireParams = tiyData.tParams.confirmOffline;
      confireParams.orderId = this.orderDetail.id;
      confireParams.serialNumber = this.orderDetail.serialNumber;
      confireParams.payway = 0;
      confireParams.fixedPoundage = 0;
      confireParams.ratePoundage = 0;
      confireParams.rate = 0;
      tiyData.tStatus.modalConfirmOffline.isShow = true;
    },
    confirmOffline(){
      confirmOffline(this, tiyData);
    },
    pckName(state,pIndex){
      if(state==100||state==102||state==103){
        return "未分配";
      }else{
        return '包裹'+(pIndex+1);
      }
    },
    isNotEmpty(val) {
      return isNotEmpty(val);
    },
    getStep(orderState){
      let state=orderState.state;
      let shipState=orderState.shipState;
      if([120,121,122,200].findIndex(function(item){return item==state})>=0){
        return 6;//用户删除
      }

      if(shipState==100){
        if([100,101,103].findIndex(function(item){return item==state})>=0){
          return 0;//预订
        }
        if([102,110].findIndex(function(item){return item==state})>=0){
          return 1;//未付款已取消或已付款
        }
        if([115].findIndex(function(item){return item==state})>=0){
          return 2;//款项和风险确认
        }
        if([116].findIndex(function(item){return item==state})>=0){
          return 2;//款项和风险确认
        }
      }else{
        if(shipState==113){
          return 3;//备货中
        }
        if(shipState==114){
          return 4;//已出库
        }
        if(shipState==111||shipState==112){
          return 5;//已发货
        }
        if([120].findIndex(function(item){return item==state})>=0){
          return 6;//款项和风险确认
        }
      }
      return 0;
    },
    back() {
      this.$router.go(-1);
    },
    yNoneText(val){
      return isNotEmpty(val)?val:'无';
    },
    getLogisticsInvoiceType(type) {
      switch (type) {
        case 100:
          return "100%(full) order value";
        case 200:
          return "Declare custom value for me on the Commercial Invoice";
        case 300:
          return "By our experience, 20%-50% of real value";
      }
    },
    getFormatedDateTime(time) {
      let formated = this.$tiyBJTime(time);
      return formated;
    },
    getSDFDateTime(time) {
      let formated =this.$tiyBJTime(time);
      return formated;
    },
    showPaymentRecord(orderDetail){ //显示订单款项记录
      getPaymentRecords(this, tiyData, orderDetail.id);
    },
    //订单操作记录
    showItemRecord(orderItem) {
      tiyData.tStatus.modalRecord.title = "订单项记录";
      tiyData.tStatus.modalRecord.recordType = 3;
      tiyData.tStatus.modalRecord.info.productCode = orderItem.productCode;
      tiyData.tStatus.modalRecord.info.productColor = orderItem.color;
      tiyData.tStatus.modalRecord.info.productSize = orderItem.sizeName;

      webItemRecord(this, tiyData, orderItem.id);
    },
    //查看产品货源信息
    showProductSupply(productId) {
      showProductSupply(this, tiyData, productId);
    },
    //查看订单优惠信息
    showOrderDiscounts(orderId) {
      tiyData.tStatus.modalDiscount.title = "订单折扣明细";
      showOrderDiscounts(this, tiyData, orderId);
    },
    showEditNote(orderDetail){ //显示修改运营备注
      this.params.modifyInnerNote.id = orderDetail.id;
      this.params.modifyInnerNote.serialNumber = orderDetail.serialNumber;
      this.params.modifyInnerNote.innerNote = '';
      this.status.modalInnerNote.isShow = true;
    },
    showEditImportantNote(orderDetail) {
      this.params.modifyImportantNote.orderIds = [orderDetail.id];
      this.params.modifyImportantNote.importantNote = orderDetail.importantNote;
      this.status.modalImportantNote.isShow = true;
    },
    clearImportantNote() {
      this.params.modifyImportantNote.importantNote = "";
    },
    modifyInnerNote(){
      modifyInnerNote(this, tiyData);
    },
    modifyImportantNote() {
      modifyImportantNote(this, tiyData);
    },
    showOrderShowRecord(recordId,showState,showTime){
      this.params.orderShowRecord.id = this.orderDetail.id;
      this.params.orderShowRecord.recordId=recordId;
      this.params.orderShowRecord.showState = showState;
      this.params.orderShowRecord.showTime = showTime;
      this.params.orderShowRecord.content = '';
      this.status.modalOrderShowRecord.isShow = true;
    },
    modifyOrderShowRecord(){
      modifyOrderShowRecord(this, tiyData);
    },
    deleteOrderShowRecord(recordId){
      let self=this;
      tiyData.tParams.orderShowRecord.id=this.orderDetail.id;
      tiyData.tParams.orderShowRecord.recordId=recordId;
      this.$Modal.confirm({
        title: "确认",
        content: "确认删除记录？",
        okText: "删除",
        cancelText: "取消",
        onOk() {
          deleteOrderShowRecord(self,tiyData);
        }
      });
    },
    getOrderCnName(orderState) {
      let name=""
      this.orderStateEnum.forEach(item=>{
        if(orderState.state==item.code){
          name=item.cnName;
          return;
        }
      })
      return name;
    },
    getDictName(dict, value) {
      let cDict = this.$store.getters.dictionaries[dict];
      let name = "";
      if (cDict) {
        let dict = cDict.filter(function (item) {
          return item.value == value
        })
        if (dict.length > 0) {
          name = dict[0].name;
        }
      }
      return name;
    },
    getReceiverPhone(receiverInfo) { //拼接收件人电话
      let phone = "";
      if(receiverInfo.countryPhoneCode){ //有国家电话区号
        phone += ("+" + receiverInfo.countryPhoneCode + " ");
      }
      if(receiverInfo.userPhoneNumber){
        phone += receiverInfo.userPhoneNumber;
      }
      return phone;
    },
    copy(text) {
      const self=this;
      this.$copyText(text).then(function (e) {
        self.$Message.success('复制成功');
      }, function (e) {
        self.$Message.error('复制失败');
      })
    },
    showCreditCard(orderId){
      getCreditCard(this, tiyData);
    }
  },
  mounted() {
    if(isNotEmpty(this.$route.params.id)){
      webOrderDetail(this, tiyData, this.$route.params.id);
    }
  },
  computed: {
    currentStep(){
      let index=0;
      let showState=this.orderDetail.orderState.showState;
      switch (showState) {
        case 10:
          index=0;
          break;
        case 20:
          index=1;
          break;
        case 30:
          index=2;
          break;
        case 50:
          index=3;
          break;
        case 100:
          index=4;
          break;
        case 200:
          index=5;
          break;
      }
      return index;
    },
    userTag(){
      let userTabList=this.orderDetail.userTabList;
      let text='';
      if(userTabList!=undefined){
        for(let i=0;i<userTabList.length;i++){
          text+=userTabList[i].name+',';
        }
        if(text.length>0){
          text=text.substring(0,text.length-1);
        }
      }
      return text;
    }
  },
}
</script>


<style scoped lang="less">
@import  (once,optional) "../css/base.less";
.order_product_div {
  margin-top: 1rem;

}

.order_product_row {
  padding: 1rem;
  border: .0625rem solid #dbdbdb;
  border-bottom-style: none;
}
.order_product_row_top {
  padding: 1rem;
  border: .0625rem #dbdbdb;
  border-top-style: solid;
}
.step_content div{
  margin-left: 1rem;
  font-size: 13px;
}

</style>
